<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>修改</title>
    <link rel="stylesheet" th:href="@{/lib/layui/css/layui.css}">
    <!--引入外部图标库-->
    <link rel="stylesheet" th:href="@{/lib/layui/myicons/iconfont.css}">
    <script th:src="@{/lib/layui/layui.js}"></script>
    <script th:src="@{/js/jquery.min.js}"></script>
</head>
<body>
    <!--该隐藏字段为了标识本次修改的内容是什么-->
    <input type="hidden" id="update-type" th:value="${operationType}">

    <!-- -------------------------------------------------------修改商品信息 Start------------------------------------------------------- -->
    <form class="layui-form  layui-form-pane form-info updateForm" update-url="updateProduct" action="" th:if="${operationType == 'product'}">
        <input type="hidden" th:value="${productInfo.id}" name="id">
        <div class="layui-form-item" style="padding: 20px">
            <div class="layui-form-item">
                <label class="layui-form-label">商品名</label>
                <div class="layui-input-inline">
                    <input type="text" name="name" lay-verify="required" th:value="${productInfo.name}" placeholder="请输入商品名" autocomplete="off"
                           class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">商品类型</label>
                <div class="layui-input-inline">
                    <select name="productType" lay-filter="type" id="type">
                        <option  th:each="type:${types}" th:value="${type.id}" th:text="${type.name}" th:selected="${type.id == productInfo.productTypeBean.id}?'true':'false'">商品类型</option>
                    </select>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">商品单价</label>
                <div class="layui-input-inline">
                    <input type="text" name="price" lay-verify="required" th:value="${productInfo.price}/100" placeholder="请输入商品单价" autocomplete="off"
                           class="layui-input">
                </div>
            </div>

            <!--<div class="layui-form-item">
                <label class="layui-form-label">商品数量</label>
                <div class="layui-input-inline">
                    <input type="text" name="count" lay-verify="required" th:value="${productInfo.count}" placeholder="请输入商品数量" autocomplete="off"
                           class="layui-input">
                </div>
            </div>-->

            <div class="layui-form-item">
                <label class="layui-form-label">商品单位</label>
                <div class="layui-input-inline">
                    <!--<input type="text" name="unit" lay-verify="required" th:value="${productInfo.unit}" placeholder="请输入商品单位" autocomplete="off"
                           class="layui-input">-->
                    <select name="unit" id="">
                        <option value="瓶" th:selected="${productInfo.unit == '瓶'}?'true':'false'">瓶</option>
                        <option value="箱" th:selected="${productInfo.unit == '箱'}?'true':'false'">箱</option>
                        <option value="袋" th:selected="${productInfo.unit == '袋'}?'true':'false'">袋</option>
                        <option value="克" th:selected="${productInfo.unit == '克'}?'true':'false'">克</option>
                        <option value="根" th:selected="${productInfo.unit == '根'}?'true':'false'">根</option>
                        <option value="盒" th:selected="${productInfo.unit == '盒'}?'true':'false'">盒</option>
                        <option value="包" th:selected="${productInfo.unit == '包'}?'true':'false'">包</option>
                    </select>
                </div>
            </div>



            <div class="layui-form-item">
                <label class="layui-form-label">商品状态</label>
                <div class="layui-input-inline">
                    <select name="status">
                        <option value="0" th:selected="${productInfo.status == 0}?'true':'false'">可销售</option>
                        <option value="1" th:selected="${productInfo.status == 1}?'true':'false'">非销售</option>
                    </select>
                    <!--<input type="text" name="status" lay-verify="required" th:value="${productInfo.status}" placeholder="请输入商品状态" autocomplete="off"
                           class="layui-input">-->
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-upload">
                    <div class="layui-upload-list">
                        <img class="layui-upload-img" id="demo1" style="height: 200px;width: 75%;" th:src="${application.showPath+productInfo.productPicture}">
                        <p id="demoText"></p>
                    </div>
                    <button type="button" class="layui-btn layui-btn-normal" id="test1">修改商品图片</button>
                </div>
            </div>

            <div class="content-input">
                <input type="button" class="layui-btn layui-btn-normal updateBtn" value="提交">
                <input type="reset" class="layui-btn layui-btn-normal" value="清空">
            </div>
        </div>

    </form>
    <!-- -------------------------------------------------------修改商品信息 End------------------------------------------------------- -->
    <!-- ------------------------------------------------------修改采购信息 Start------------------------------------------------------ -->
    <form action="" method="post" update-url="updatePurchaseInfo" th:name="${operationType}" class="updateForm layui-form layui-form-pane form-info" th:if="${operationType == 'purchase'}" style="height: 100%">
        <input type="hidden" th:value="${purchases.id}" name="id">
        <div style="width:100%">
            <div class="layui-form-item">
                <div class="layui-form-item">
                    <label class="layui-form-label">商品名</label>
                    <div class="layui-input-inline">
                        <select name="productId" lay-filter="type">
                            <option  th:each="list:${lists}" th:value="${list.id}" th:text="${list.name}" th:selected="${list.id == purchases.productId}?'true':'false'">商品名</option>
                        </select>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">商品进价</label>
                    <div class="layui-input-inline">
                        <input type="text" name="price" lay-verify="required" placeholder="请输入商品进价" autocomplete="off" th:value="${purchases.price}/100"
                               class="layui-input">
                    </div>
                </div>

                <!--存入修改之前采购的数量-->
                <input type="hidden" name="beforeCount" th:value="${purchases.count}">

                <div class="layui-form-item">
                    <label class="layui-form-label">商品数量</label>
                    <div class="layui-input-inline">
                        <input type="text" name="count" lay-verify="required" placeholder="请输入商品数量" autocomplete="off" th:value="${purchases.count}"
                               class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">商品单位</label>
                    <div class="layui-input-inline">
                        <select name="unit">
                            <option value="瓶" th:selected="${purchases.unit == '瓶'}?'true':'false'">瓶</option>
                            <option value="箱" th:selected="${purchases.unit == '箱'}?'true':'false'">箱</option>
                            <option value="袋" th:selected="${purchases.unit == '袋'}?'true':'false'">袋</option>
                            <option value="克" th:selected="${purchases.unit == '克'}?'true':'false'">克</option>
                            <option value="根" th:selected="${purchases.unit == '根'}?'true':'false'">根</option>
                            <option value="盒" th:selected="${purchases.unit == '盒'}?'true':'false'">盒</option>
                            <option value="包" th:selected="${purchases.unit == '包'}?'true':'false'">包</option>
                        </select>
                    </div>
                </div>

            </div>
        </div>
        <div class="content-input">
            <input type="button" value="提交" name="submit" class="layui-btn updateBtn layui-btn-normal">
            <input type="reset" class="layui-btn layui-btn-normal" value="清空">
        </div>
    </form>
    <!-- -------------------------------------------------------修改采购信息 END------------------------------------------------------- -->

    <!-- -------------------------------------------------------修改菜品信息 Start------------------------------------------------------- -->
    <form class="layui-form  layui-form-pane form-info updateForm" update-url="updateDishes" action="" th:if="${operationType == 'dishes'}">
        <input type="hidden" th:value="${dishesList.id}" name="id">
        <div class="layui-form-item" style="padding: 20px">
            <div class="layui-form-item">
                <label class="layui-form-label">商品名</label>
                <div class="layui-input-inline">
                    <input type="text" name="name" lay-verify="required" th:value="${dishesList.name}" placeholder="请输入菜品名" autocomplete="off"
                           class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">商品单价</label>
                <div class="layui-input-inline">
                    <input type="text" name="price" lay-verify="required" th:value="${dishesList.price}/100" placeholder="请输入商品单价" autocomplete="off"
                           class="layui-input">
                </div>
            </div>

<!--            <input type="hidden" name="picture" th:value="${session.fileName}">-->

            <div class="layui-form-item">
                <div class="layui-upload">
                    <div class="layui-upload-list">
                        <img class="layui-upload-img" id="demo1" style="height: 200px;width: 75%;" th:src="${application.showPath+dishesList.picture}">
                        <p id="demoText"></p>
                    </div>
                    <button type="button" class="layui-btn layui-btn-normal" id="test1">修改商品图片</button>
                </div>
            </div>

            <div class="content-input">
                <input type="button" class="layui-btn layui-btn-normal updateBtn" value="提交">
                <input type="reset" class="layui-btn layui-btn-normal" value="清空">
            </div>
        </div>

    </form>
    <!-- -------------------------------------------------------修改商品信息 End------------------------------------------------------- -->
    <script>
        //Demo
        layui.use(['form','upload'], function(){
            var form = layui.form
                ,upload = layui.upload
                ,$ = layui.jquery;

            /**
             * 绑定回车事件
             */
            $(document).keypress(function (e) {
                //如果当前有类似layer.alert的窗体，点击最上层的确定按钮，并且取消所有焦点
                if($('.layui-layer-btn0').length > 0){
                    $('.layui-layer-btn0').eq($('.layui-layer-btn0').length - 1)[0].click();
                    $("*").blur();
                }
            });

            //监听提交
            form.on('submit(formDemo)', function(data){
                layer.msg(JSON.stringify(data.field));
                return false;
            });

            //普通图片上传
            var uploadInst = upload.render({
                elem: '#test1'
                ,url: 'uploads'
                ,size:2048
                ,acceptMime:'image/jpg, image/png, image/gif'       //上传所有类型的图片
                //限制文件大小为2M
                ,before: function(obj){
                    //预读本地文件示例，不支持ie8
                    obj.preview(function(index, file, result){
                        $('#demo1').attr('src', result); //图片链接（base64）
                    });
                }
                ,done: function(res){
                    //上传成功
                    if (res.result == "success"){
                        layer.confirm('上传图片成功！',{
                            btn:['确定']  //按钮
                            , skin: 'layui-layer-lan'
                            , icon: 6
                        });
                        console.log(res.success);
                    }else{//上传失败
                        layer.confirm('上传图片失败！',{
                            btn:['确定']  //按钮
                            , skin: 'layui-layer-lan'
                            , icon: 6
                        });
                    }

                }
                ,error: function(){
                    //演示失败状态，并实现重传
                    var demoText = $('#demoText');
                    demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                    demoText.find('.demo-reload').on('click', function(){
                        uploadInst.upload();
                    });
                }
            });
            /**
             * 单击提交事件
             */
            $(".updateBtn").click(function () {
                //获取表单数据
                //判断修改对象
                var formName = $("#update-type").val();
                var addData = getSubmitData(formName);
                //判断是否为空
                var flag = verifyData(formName);
                //获取提交的url
                var url = $(".updateForm").attr("update-url");
                //ajax提交
                if (flag.trim().length == 0) {
                    $.getJSON(
                        url,
                        addData,
                        function (rollData) {
                            if (rollData.result == "success") {
                                layer.confirm(rollData.msg,{
                                    btn:['确定']  //按钮
                                    , skin: 'layui-layer-lan'
                                    , icon: 6
                                },function () {
                                    window.parent.location.reload();    //刷新父页面
                                });
                            } else {
                                layer.confirm(rollData.msg,{
                                    btn:['确定']  //按钮
                                    , skin: 'layui-layer-lan'
                                    , icon: 5
                                    , anim: 6
                                },function () {
                                    window.parent.location.reload();    //刷新父页面
                                });
                            }
                        }
                    )
                }else{
                    layer.open({
                        title: '错误消息'
                        , content: flag
                        , skin: 'layui-layer-lan'
                        , shade: 0
                        , icon: 5
                        , anim: 6
                        , closeBtn: 0
                    })
                }

            });
            /**
             * 获取提交数据
             */
            function getSubmitData(formName){
                var addData = '';
                if (formName == "product"){
                    var form = $(".updateForm");

                    var id = form.find($("input[name = 'id']")).val();  //获取id
                    var name = form.find($("input[name = 'name']")).val();  //获取商品名
                    var price = form.find($("input[name='price']")).val();      //获取商品单价
                   /* var count = form.find($("input[name='count']")).val();   //获取商品数量*/
                    var unit = form.find($("select[name='unit']")).val();   //获取商品单位
                    var productType = form.find($("select[name='productType']")).val();//获取商品类型ID
                    var status = form.find($("select[name='status']")).val();//获取商品状态
                    var addData = {
                        "id":id,
                        "name":name,
                        "price":price*100,
                        /*"count":count,*/
                        "unit":unit,
                        "productType":productType,
                        "status":status
                    };
                }else if(formName == 'purchase'){
                    var form = $(".updateForm");
                    var id = form.find($("input[name = 'id']")).val();  //获取id
                    var price = form.find($("input[name='price']")).val();    //获取商品单价
                    var count = form.find($("input[name='count']")).val();   //获取商品数量
                    var beforeCount = form.find($("input[name='beforeCount']")).val();   //获取修改之前的商品数量
                    var unit = form.find($("select[name='unit']")).val();   //获取商品单位
                    var productId = form.find($("select[name='productId']")).val();  //获取商品ID
                    //获取当前时间(精确到时分秒)
                    var day2 = new Date();
                    day2.setTime(day2.getTime());
                    var s2 = day2.getFullYear()+"-" + (day2.getMonth()+1) + "-" + day2.getDate()+" "+day2.getHours()+":"+day2.getMinutes()+":"+day2.getSeconds();
                    //采购总价
                    var totalPrice = price*count;
                    addData = {
                        "id":id,
                        "productId": productId,
                        "price": price * 100,
                        "beforeCount":beforeCount,
                        "count": count,
                        "unit": unit,
                        "purchaseDate":s2,
                        "totalPrice":totalPrice * 100
                    };
                }else if(formName == 'dishes'){
                    var form = $(".updateForm");

                    var id = form.find($("input[name = 'id']")).val();  //获取id
                    var name = form.find($("input[name = 'name']")).val();  //获取菜品名
                    var price = form.find($("input[name='price']")).val();      //获取菜品单价
                    // var picture = form.find($("input[name='picture']")).val();
                    addData = {
                        "id":id,
                        "name":name,
                        "price":price*100
                        // "picture":picture
                    };
                }
                return addData;
            }

            /**
             * 验证数据
             */
            function verifyData(formName){
                var result = "";
                switch(formName){
                    case "product":
                        result = verifyPetInfo();
                        break;
                    case "purchase":
                        //获取表单
                        var form = $(".updateForm");
                        var znum = /^[0-9]+$/; //验证是否是正整数
                        var num = /(?!^0*(\.0{1,2})?$)^\d{1,13}(\.\d{1,2})?$/; //验证是否为数字
                        var price = form.find($("input[name='price']")).val();      //获取商品单价
                        var count = form.find($("input[name='count']")).val();   //获取商品数量
                        if(!num.test(price)){
                            result = "商品单进价式不正确!";
                        }else if(!znum.test(count)){
                            result = "商品数量必须为整数！";
                        }
                        break;
                    case "dishes":
                        //获取表单
                        var form = $(".updateForm");
                        var num = /(?!^0*(\.0{1,2})?$)^\d{1,13}(\.\d{1,2})?$/; //验证是否为数字
                        var price = form.find($("input[name='price']")).val();      //获取商品单价
                        var name = form.find($("input[name = 'name']")).val();     //获取商品名
                        if(name.trim().length <= 0){
                            result = "菜品名不能为空！";
                        }else if(!num.test(price)){
                            result = "菜品单价格式不正确!";
                        }
                        break;
                }
                return result;
            }
            /**
             * 验证商品信息
             */
            function verifyPetInfo(){
                //获取表单
                var form = $(".updateForm");
                /*var znum = /^[0-9]+$/; //验证是否是正整数*/
                var num = /(?!^0*(\.0{1,2})?$)^\d{1,13}(\.\d{1,2})?$/; //验证是否为数字
                //验证表单需要填写的字段
                var name = form.find($("input[name = 'name']")).val();  //获取商品名
                var price = form.find($("input[name='price']")).val();      //获取商品单价
               /* var count = form.find($("input[name='count']")).val();   //获取商品数量*/
                //var unit = form.find($("input[name='unit']")).val();   //获取商品单位
                //验证是否为空
                if(name.trim().length <= 0){
                    return "商品名不可为空！";
                }else if(!num.test(price)){
                    return "商品单价格式不正确!";
                }/*else if(!znum.test(count)){
                    return "商品数量必须为整数！";
                }*//*else if(unit.trim().length <= 0){
                return "商品单位不可为空！";
            }*/
                return "";
            }

        });
    </script>
</body>
</html>